<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" 
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml"
	xmlns:f="http://java.sun.com/jsf/core"
	xmlns:h="http://java.sun.com/jsf/html"
	xmlns:p="http://primefaces.org/ui"
	xmlns:ui="http://java.sun.com/jsf/facelets"
	>

<h:head>
</h:head>
<h:body>

		<ui:include src="usermenu.xhtml" />


    	<h:form>	
    		<p:dataTable value="#{MBDetalle.vistaC}" var="producto" id="listaProductos" name="listaProductos" editable="true">
			<f:facet name="header">  
            	Items en el carro  
        	</f:facet>  
            <p:column headerText="Nombre producto" style="width:10%">
            	<p:cellEditor>
        			<f:facet name="output">
           				<h:outputText value="#{producto.nomProd}" />
        			</f:facet>
        			<f:facet name="input">
           				<p:inputText value="#{producto.nomProd}" style="width:100%"/>
        			</f:facet>
        		</p:cellEditor>
    		</p:column>
    		<p:column headerText="Cantidad" style="width:5%">
           				<h:outputText value="#{producto.cantProd}" />
           		&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;		
        		<p:commandButton ajax="false" action="#{MBDetalle.sumarProducto(producto)}" 
				 id="adding" icon="ui-icon-circle-plus" title="Click para sumar"/>
				 <p:commandButton ajax="false" action="#{MBDetalle.restarProducto(producto)}" 
				 id="sustracting"  icon="ui-icon-circle-minus" title="Click para restar"/>
				 <p:commandButton ajax="false" action="#{MBDetalle.elimProducto(producto)}" 
				 id="deleting" icon="ui-icon-circle-close" title="Click para eliminar"/>
    		</p:column>
    		<p:column headerText="Precio" style="width:10%">
            	<p:cellEditor>
        			<f:facet name="output">
           				<h:outputText value="#{producto.precioProd}" />
        			</f:facet>
        			<f:facet name="input">
           				<p:inputText value="#{producto.precioProd}" style="width:100%"/>
        			</f:facet>
        		</p:cellEditor>
    		</p:column>
    		<p:column headerText="Subtotal" style="width:10%">
        			<p:cellEditor>
        			<f:facet name="output">
           				<h:outputText value="#{MBDetalle.subTotal(producto)}" />
        			</f:facet>
        			<f:facet name="input">
           				<p:inputText value="#{MBDetalle.subTotal(producto)}" style="width:100%"/>
        			</f:facet>
        		</p:cellEditor>
    		</p:column>
            </p:dataTable>
       </h:form>
       
       <h:form>
       		  	<p:commandButton action="index.jsf" 
       		  	value="volver"/>
       </h:form>
       
       <h:form>
       <p:growl id="growl" showDetail="true" sticky="true" />  
       		  	<p:commandButton action="#{MBDetalle.realizarCompra()}" 
       		  	id="compra" value="realizar compra"  update="growl"/>
       </h:form>    
       
</h:body>
</html>